3장. 클로드 코드를 내 컴퓨터에 들이기

출처: 『혼자 공부하는 바이브 코딩 with 클로드 코드』(조태호) | 예제 코드: github.com/taehojo/vibecoding

코드는 분위기만 — npm, pip, .py 같은 말은 몰라도 됩니다. 표의 '비유'와 '위험'만 봐도 충분해요.

지금까지는 웹 채팅으로 AI에게 일을 시켰다.

이 장부터는 클로드 코드를 내 컴퓨터에 깔아, AI가 내 컴퓨터의 파일을 직접 만들게 한다.

택시(웹 챗봇)를 타다가, 내 차(클로드 코드)를 산다고 보면 된다.

그 차를 내 차고에 들이고, 첫 AI 프로그램을 만들고, 차에 "우리 집 규칙" 메모를 붙이는 게 이번 장이다.

0. 이 장의 새 단어 (0장에 없는 것만)

0장 용어집에 이미 있는 말(터미널, Node.js, Git, npm, MNIST, CLAUDE.md, /init, 배치 파일, localhost)은 거기서 보면 된다.

이 장에서 처음 나오는 말은 딱 3개다.

pip(핍)

한 문장 뜻 — 파이썬 프로그램이 쓸 부품(라이브러리)을 인터넷에서 받아 깔아 주는 설치 도우미.

일상비유 — npm이 클로드 코드용 앱스토어라면, pip는 파이썬용 앱스토어다. 이름만 대면 알아서 받아 깐다.

한 줄 예 —

# 이 한 줄로 필요한 부품을 한꺼번에 깐다
# > pip install -r requirements.txt

requirements.txt(리콰이어먼츠 닷 티엑스티)

한 문장 뜻 — 이 프로그램이 돌려면 어떤 부품이 필요한지 이름과 버전을 줄줄이 적어 둔 준비물 목록.

일상비유 — 요리 레시피 맨 위의 "재료 목록". 이대로 사 오면 빠진 재료 없이 요리를 똑같이 만들 수 있다.

한 줄 예 —

# 이 목록을 보고 pip가 부품을 다 깐다
# tensorflow>=2.10.0
# numpy>=1.21.0

초기 설정(로그인 연동)

한 문장 뜻 — 클로드 코드를 처음 켤 때, 테마를 고르고 내 계정과 연결해 "이제부터 이 사람 거"라고 등록하는 한 번뿐인 절차.

일상비유 — 새 휴대폰을 처음 켜면 언어 고르고 계정 로그인을 한 번 하는 것. 그다음부터는 안 묻는다.

한 줄 예 —

# 처음 한 번만: 테마 고르기 → 계정 연동 → 파일 접근 동의
# > claude   (치면 설정이 시작된다)

이런 적 있죠?

웹 채팅으로 AI가 코드를 만들어 줬는데, 그걸 내 컴퓨터에서 돌리려니 막막한 적 있죠?

코드를 복사해 붙이고, 부품을 어디서 받는지 찾고, 실행은 또 어떻게 하는지 헤맨다.

그런데 클로드 코드를 내 컴퓨터에 깔면, AI가 파일을 직접 만들고 부품도 알아서 깔고 실행까지 해 준다.

내가 할 일은 말로 시키고 결과를 보는 것뿐이다.

그게 바로 이 장에서 배우는 일이다.

이 장에서 딱 4가지만

TL;DR

1. 클로드 코드를 내 컴퓨터에 깔려면 먼저 도로(Node.js)와 타임머신(Git)을 깔고, npm 한 줄로 클로드 코드를 깐다.
2. 터미널은 무서운 게 아니라, 명령어 몇 개에 반응하는 검은 대화창이다. dir, mkdir, cd만 알면 된다.
3. "손글씨 숫자 인식 프로그램 만들어 줘" 한 줄이면, AI가 코드·부품·실행을 다 해 준다. 딥러닝을 몰라도 된다.
4. CLAUDE.md라는 메모를 두면, 클로드 코드가 켤 때마다 읽고 우리 프로젝트 규칙을 알아서 따른다.

개념 1 — 클로드 코드 깔기 (도로 → 타임머신 → 차)

막히는 장면

"클로드 코드 설치"라는 말을 보고, 뭘 먼저 깔아야 하는지 순서를 몰라 막힌 적 있죠?

그냥 클로드 코드만 깔면 될 것 같은데, 안 된다.

클로드 코드가 달릴 바탕을 먼저 깔아야 한다.

비유 먼저

차를 한 대 들이는 일을 떠올려 보자.

차가 달리려면 먼저 도로가 깔려 있어야 한다. 그 도로가 Node.js다.

사고가 나도 어제로 되돌릴 타임머신이 있으면 든든하다. 그 타임머신이 Git이다.

도로와 타임머신이 준비되면, 마지막으로 차(클로드 코드)를 주문해 들인다. 그 주문 버튼이 npm이다.

한 문장 정의 — 클로드 코드를 깔려면 Node.js(실행 바탕)와 Git(버전 관리)을 먼저 깔고, npm 명령 한 줄로 클로드 코드를 받아 깐다.

여기서 -g는 "컴퓨터 어디서나 쓰게"라는 뜻이다.

이 표시가 있어야 어느 폴더에서든 claude라고 칠 수 있다.

예시 폭격

예시 1 (완성예 — 그대로 따라 하기).

설치는 세 줄짜리 이야기다.

# 1) 도로 깔기 — nodejs.org/ko 에서 설치 프로그램 받아 기본 설정으로 설치
# 2) 타임머신 두기 — git-scm.com 에서 설치 프로그램 받아 기본 설정으로 설치
# 3) 차 주문 — 터미널에 아래 한 줄
# > npm install -g @anthropic-ai/claude-code

예시 2 (설치 뒤 첫 실행 — 초기 설정).

다 깔았으면 검은 창에 claude만 치면 처음 한 번 설정이 시작된다.

# > claude
# 1. 테마 선택 (Light mode 권장 — 인쇄 가독성)
# 2. 로그인: "Claude account with subscription" 선택 (Pro 이상 필요)
# 3. 브라우저에서 [승인] 클릭 → 계정 연동
# 4. 파일 접근: "Yes, proceed" 선택
# → "Welcome back" 메시지가 뜨면 성공

예시 3 (부분완성 — 빈칸 채우기).

아래 빈칸에 뭐가 들어갈까?

# 클로드 코드가 달릴 '도로'를 까는 사이트는 ______ 이다.
# (답: nodejs.org/ko)
# 컴퓨터 어디서나 쓰게 하는 npm 옵션은 ______ 이다.
# (답: -g)

미니 시나리오 — 이럴 때 이렇게

claude를 쳤는데 "명령어를 찾을 수 없다"가 뜬다.

이럴 땐 차(클로드 코드)를 깔기 전에 도로(Node.js)부터 안 깔았는지 의심한다.

순서대로 Node.js → npm 설치 줄을 다시 밟으면 풀린다.

개념 2 — 터미널은 검은 대화창일 뿐

막히는 장면

검은 화면에 글자만 깜빡이는 터미널을 보고, 뭘 잘못 건드리면 컴퓨터가 망가질까 봐 손이 멈춘 적 있죠?

터미널은 무서운 도구가 아니다.

명령어 몇 마디에 또박또박 반응하는, 글로 시키는 대화창일 뿐이다.

비유 먼저

식당에서 점원에게 말로 주문하는 카운터를 떠올려 보자.

"메뉴판 보여 줘", "주방으로 가 줘", "이 자리에 앉을게" 같은 말을 글로 적어 건넨다고 보면 된다.

터미널도 몇 개의 짧은 말만 알면 충분하다.

한 문장 정의 — 터미널은 버튼 대신 짧은 명령어를 글로 쳐서 컴퓨터에 시키는 대화창이며, dir·mkdir·cd 세 개만 알아도 기본 이동이 된다.

참고로 터미널 자체를 여는 명령은 윈도우 검색창에 cmd라고 치는 것이다.

예시 폭격

예시 1 (완성예 — 폴더 만들고 들어가기).

새 작업 방을 만들고 그 안으로 들어가는 흐름이다.

# > mkdir Study-01      (Study-01 이라는 방을 만든다)
# > cd Study-01         (그 방으로 들어간다)
# > dir                 (방 안에 뭐가 있나 본다 — 아직 비었다)

예시 2 (before/after — 종료가 안 될 때).

# before: Ctrl+C 를 한 번만 눌렀더니 클로드 코드가 안 꺼진다
# after : Ctrl+C 를 두 번 연속 누르면 깔끔히 종료된다

예시 3 (부분완성 — 빈칸 채우기).

# 새 폴더를 만드는 명령어는 ______ 이다.
# (답: mkdir)
# 폴더 안 파일 목록을 보는 명령어는 ______ 이다.
# (답: dir)

미니 시나리오 — 이럴 때 이렇게

cd로 폴더에 들어가려는데 "그런 폴더가 없다"고 나온다.

이럴 땐 먼저 dir로 지금 자리에 그 폴더가 정말 있는지 눈으로 확인한다.

이름을 한 글자라도 틀리면 못 들어가니, 보이는 그대로 다시 친다.

개념 3 — 한 줄 프롬프트로 첫 AI 프로그램

막히는 장면

"손글씨를 알아보는 AI 프로그램"이라는 말만 들어도, 딥러닝을 몇 달 배워야 할 것 같아 지레 포기한 적 있죠?

그런데 바이브 코딩에서는 그 이론을 몰라도 된다.

AI에게 말 한 줄로 시키면, 코드도 부품도 실행도 AI가 다 한다.

비유 먼저

요리를 못 하는 사람이 요리사에게 "손글씨 알아보는 요리 해 줘"라고 말하는 장면을 떠올려 보자.

요리사(AI)가 레시피(코드)를 짜고, 재료(부품 라이브러리)를 사 오고, 요리(실행)까지 해서 내온다.

나는 맛보고 "좀 더 이렇게"라고 고치기만 하면 된다.

한 문장 정의 — 클로드 코드는 한 줄 프롬프트만 받아 코드 파일·부품 목록(requirements.txt)·실행까지 자동으로 해 주므로, 딥러닝 이론 없이도 첫 AI 프로그램을 만들 수 있다.

여기서 AI가 쓰는 연습 재료가 0장에서 본 MNIST다.

0~9 손글씨 7만 장을 모아 둔, 입문용으로 가장 유명한 데이터 묶음이다.

예시 폭격

예시 1 (완성예 — 시키는 프롬프트 그대로).

# 클로드 코드에 이 한 줄만 입력
# "손글씨로 숫자를 입력하면 인식하는 코드를 만들어서 실행해 줘.
#  모든 코드와 주석을 영어로 작성해 줘."
# → AI가 알아서: 코드 생성 → requirements.txt 생성 → pip 설치 → 실행

예시 2 (결과를 확인하는 장면).

# 흰 상자에 마우스로 숫자 4 를 그린다
# [Recognize] 버튼을 누른다
# 출력: "Predicted Digit: 4, Confidence: 79.97%"
# → 그린 숫자를 AI가 맞혔다

예시 3 (before/after — 더블 클릭으로 켜기).

# before: 매번 터미널을 열고 'python digit_recognition.py' 를 친다
# after : "탐색기에서 클릭해서 실행하게 해 줘" 라고 시킨다
#         → .bat 배치 파일이 생긴다 → 더블 클릭 한 번이면 끝

예시 4 (부분완성 — 빈칸 채우기).

# 프로그램에 필요한 부품 목록이 적힌 파일은 ______ 이다.
# (답: requirements.txt)
# 그 목록대로 부품을 한꺼번에 까는 명령은 pip install ___ requirements.txt 이다.
# (답: -r)

미니 시나리오 — 이럴 때 이렇게

프로그램을 만들었는데 한글이 깨지거나 인코딩 오류가 난다.

이럴 땐 폴더나 파일 이름에 한글이 섞이지 않았는지 본다.

0장 척추 7에서 봤듯, 경로에는 영문과 숫자만 쓰는 게 안전하다.

예: 내프로젝트/가 아니라 VibeCoding/Study-01/처럼 짓는다.

개념 4 — CLAUDE.md, 우리 집 규칙 메모

막히는 장면

클로드 코드를 켤 때마다 "우리는 영문 파일명만 써", "주석은 한글로 써"를 처음부터 다시 설명한 적 있죠?

세션이 끊기면 AI는 어제 한 약속을 기억하지 못한다.

그 규칙을 메모 한 장에 적어 두면, AI가 켤 때마다 읽고 알아서 따른다.

비유 먼저

새 직원이 올 때마다 업무를 말로 일일이 설명하면 지친다.

대신 "업무 인수인계 매뉴얼" 한 부를 쥐여 주면, 읽고 알아서 일한다.

그 매뉴얼이 CLAUDE.md다. (0장 척추 6에서 본 그 메모다.)

한 문장 정의 — CLAUDE.md는 프로젝트의 규칙·구조·명령어를 적어 두는 메모 파일이며, /init으로 자동 생성하고 # 기호로 규칙을 빠르게 덧붙일 수 있다.

규칙을 어디에 저장할지도 고를 수 있다.

모든 프로젝트에 공통으로 적용하려면 User memory(~/.claude/CLAUDE.md), 이 프로젝트에만 적용하려면 Project memory(./CLAUDE.md)를 고른다.

예시 폭격

예시 1 (완성예 — /init으로 메모 만들기).

# 클로드 코드 안에서 한 줄
# /init
# → 현재 폴더의 파일을 둘러보고 CLAUDE.md 를 알아서 작성

예시 2 (# 기호로 규칙 덧붙이기).

# 대화 중에 # 로 시작하면 그 말이 규칙으로 저장된다
# # 앞으로 만드는 모든 파일은 날짜와 시간을 주석으로 표시해 줘
# → 다음부터 AI가 이 규칙을 알아서 지킨다

예시 3 (before/after — 규칙을 안 적었을 때 vs 적었을 때).

# before: 세션이 끊길 때마다 "영문 파일명만 써" 를 또 설명한다
# after : CLAUDE.md 에 한 번 적어 두면, 켤 때마다 AI가 읽고 따른다

예시 4 (계층적 폴더 구조 — 부분완성).

공통 규칙은 위에, 특화 규칙은 아래 폴더에 둔다.

# Study-01/                ← 루트: 공통 CLAUDE.md (모두에게 적용)
# ├── web_version/         ← 웹 전용 CLAUDE.md
# └── desktop_version/     ← 데스크톱 전용 CLAUDE.md
# 빈칸: 모든 폴더에 공통인 규칙은 ______ 폴더의 CLAUDE.md 에 적는다.
# (답: 루트 / Study-01)

미니 시나리오 — 이럴 때 이렇게

데스크톱으로 만든 손글씨 프로그램을 웹에서도 돌리고 싶다.

이럴 땐 "웹 버전 프로그램을 브라우저에서 실행해 줘"라고 시킨다.

AI가 웹용 코드를 만들고 내 컴퓨터에 작은 서버를 띄운다.

그러면 브라우저 주소창에 localhost:8080을 쳐서 (0장 용어집의 localhost) 웹 버전을 볼 수 있다.

단순 규칙 (지금은 이것만)

한 걸음 더 ▸ (지금 몰라도 됨)

지금은 단순 규칙 세 개면 충분하다.

1. 깔 때는 순서대로 — Node.js → Git → npm으로 클로드 코드.
2. 시킬 때는 한 줄로 또렷이 — "손글씨 인식 프로그램 만들어 줘"처럼.
3. 규칙은 CLAUDE.md에 적어 두기 — 매번 다시 설명하지 않게.

"AI가 다 해 주니 결과는 안 봐도 되지 않나?"는 아니다. 흰 상자에 숫자를 그려 맞는지 직접 확인하는 게 바이브 코딩의 절반이다.

지금은 "순서대로 깔고, 한 줄로 시키고, 규칙은 메모에" 이 세 가지만 들고 가면 된다.

정리

클로드 코드는 도로(Node.js)·타임머신(Git)을 먼저 깔고 npm 한 줄로 들인다.

터미널은 dir·mkdir·cd 몇 마디면 충분한 검은 대화창이다.

"만들어 줘" 한 줄이면 AI가 코드·부품(pip, requirements.txt)·실행까지 해 주고, CLAUDE.md 메모로 우리 집 규칙을 자동으로 따르게 한다.

다음 4장 예고 — 클로드 코드로 실제 작업을 더 자유롭게 다루는 법을 본다. (지금 몰라도 됩니다 — 4장에서 천천히 풀려요.)